<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <!-- 
      根据案例可以看到5的打印在4的后边,所以整体的script其实是一个异步宏任务

     -->
    <!--  <script>
      var a = 1;
      console.log(a);
      setTimeout(() => {
        console.log(2);
      });

      new Promise((resolve, reject) => {
        console.log(3);
        resolve();
      }).then(() => {
        console.log(4);
      });
    </script>
    <script>
      var b = 5;
      console.log(5);
    </script> -->

    <script>
     /*  new Promise((resolve, reject) => {
        console.log(1);
        resolve(1);
      })
        .then(() => {
          console.log(2);
          new Promise((resolve, reject) => {
            console.log(3);
            resolve();
          })
            .then(() => {
              console.log(4);
            })
            .then(() => {
              console.log(5);
            })
            .then(() => {
              console.log(6);
            });
          console.log(8);
        })
        .then(() => {
          console.log(7);
        }); */
    </script>
  </body>
</html>
